<!DOCTYPE html>
<!DOCTYPE html>
<html lang="en">
<head>
    <title>设备编辑</title>
    {% include 'admin/common/header.html' %}
</head>
<body>
<form class="layui-form" action="">
    <div class="mainBox">
        <div class="main-container">
            <div class="main-container">
                <div class="layui-form-item">
                    <label class="layui-form-label">罪犯编号</label>
                    <div class="layui-input-block">
                        <input type="text" value="{{ prisoner.code }}" name="code" id="code"
                               autocomplete="off" placeholder="请输入罪犯编号" class="layui-input">
                        <p id="code-alert" style="color:orangered;"></p>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">名字</label>
                    <div class="layui-input-block">
                        <input type="text" value="{{ prisoner.name }}" name="name" id="name"
                               autocomplete="off" placeholder="请输入罪犯名称" class="layui-input">
                        <p id="name-alert" style="color:orangered;"></p>
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">身份证号</label>
                    <div class="layui-input-block">
                        <input type="text" value="{{ prisoner.id_number }}" name="id_number" id="id_number"
                               autocomplete="off" placeholder="请输入标题"
                               class="layui-input">
                        <p id="id-alert" style="color:orangered;"></p>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">性别</label>
                    <div class="layui-input-block">
                        <select id="gender">
                            <option value="">请选择性别</option>
                            <option value="0">男</option>
                            <option value="1">女</option>
                            <option value="2">武装直升机</option>
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">生日</label>
                    <div class="layui-input-block">
                        <input type="text" value="{{ prisoner.birthday }}" name="birthday" class="layui-input"
                               id="birthday"
                               placeholder="请选择生日">
                    </div>
                </div>
                <div class="layui-form-item" id="native_place">
                    <div class="layui-form-label">籍贯</div>
                    <div class="layui-input-inline" style="width: 110px;">
                        <select name="province" class="province-selector" data-value="{{ prisoner.native_province }}">
                            <option value="">请选择省</option>
                        </select>
                    </div>
                    <div class="layui-input-inline" style="width: 110px;">
                        <select name="city" class="city-selector" data-value="{{ prisoner.native_city }}">
                            <option value="">请选择市</option>
                        </select>
                    </div>
                    <div class="layui-input-inline" style="width: 110px;">
                        <select name="county" class="county-selector" data-value="{{ prisoner.native_county }}">
                            <option value="">请选择区</option>
                        </select>
                    </div>
                </div>
                <div class="layui-form-item" id="address_place">
                    <label class="layui-form-label">住址</label>
                    <div class="layui-input-inline" style="width: 110px;">
                        <select name="province" class="province-selector" data-value="{{ prisoner.address_province }}">
                            <option value="">请选择省</option>
                        </select>
                    </div>
                    <div class="layui-input-inline" style="width: 110px;">
                        <select name="city" class="city-selector" data-value="{{ prisoner.address_city }}">
                            <option value="">请选择市</option>
                        </select>
                    </div>
                    <div class="layui-input-inline" style="width: 110px;">
                        <select name="county" class="county-selector" data-value="{{ prisoner.address_county }}">
                            <option value="">请选择区</option>
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <div class="layui-input-block">
                        <input type="text" id="address" name="address" lay-verify="address" autocomplete="off"
                               class="layui-input" value="{{ prisoner.address_detail }}">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">指控罪名</label>
                    <div class="layui-input-block">
                        <input type="text" value="{{ prisoner.charges }}" name="charges"
                               autocomplete="off" placeholder="请输入指控罪名"
                               class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">严管类型</label>
                    <div class="layui-input-block">
                        <input type="text" value="{{ prisoner.yg_type }}" name="yg_type"
                               autocomplete="off" placeholder="请输入严管类型"
                               class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">所属部门</label>
                    <div class="layui-input-block">
                        <ul id="selectParent" name="dept_id" class="dtree" data-id="0"></ul>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">房号</label>
                    <div class="layui-input-block">
                        <input type="text" value="{{ prisoner.room_num }}" name="room_num"
                               autocomplete="off" placeholder="请输入房号"
                               class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">床号</label>
                    <div class="layui-input-block">
                        <input type="text" value="{{ prisoner.bed_num }}" name="bed_num"
                               autocomplete="off" placeholder="请输入床号" class="layui-input">
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="bottom">
        <div class="button-container">
            <button type="submit" class="pear-btn pear-btn-primary pear-btn-sm" lay-submit=""
                    lay-filter="user-update">
                <i class="layui-icon layui-icon-ok"></i>
                提交
            </button>
            <button type="reset" class="pear-btn pear-btn-sm">
                <i class="layui-icon layui-icon-refresh"></i>
                重置
            </button>
        </div>
    </div>
</form>
{% include 'admin/common/footer.html' %}
<script src="{{ url_for('static', filename='/admin/component/pear/module/area.js') }}"></script>
<script>
    layui.use(['form', 'jquery', 'dtree'], function () {
        let form = layui.form
        let $ = layui.jquery
        let laydate = layui.laydate
        let area = layui.area
        let dtree = layui.dtree
        let code_legal = true
        let name_legal = true
        let id_legal = true
        let native_province = "{{ prisoner.native_province }}"
        let native_city = "{{ prisoner.native_city }}"
        let native_county = "{{ prisoner.native_county }}"
        let address_province = "{{ prisoner.address_province }}"
        let address_city = "{{ prisoner.address_city }}"
        let address_county = "{{ prisoner.address_county }}"
        $('#gender').val("{{ prisoner.gender }}")
        form.render('select')

        // 渲染
        laydate.render({
            elem: '#birthday'
        });
        if (isIdcard($('#id_number').val())) {
            $('#id-alert').text('')
            id_legal = true
            $('#birthday').prop('disabled', true)
            $('#gender').prop('disabled', true)

        }
        area.render({
            elem: '#native_place',
            change: function (res) {
                native_province = res.province
                native_city = res.city
                native_county = res.county
            }
        });
        area.render({
            elem: '#address_place',
            change: function (res) {
                address_province = res.province
                address_city = res.city
                address_county = res.county
            }
        });
        dtree.renderSelect({
            elem: '#selectParent',
            url: '/dept/tree',
            method: 'get',
            selectInputName: {nodeId: 'dept_id', context: 'deptName'},
            skin: 'layui',
            dataFormat: 'list',
            response: {treeId: 'deptId', parentId: 'parentId', title: 'deptName'},
            selectInitVal: "{{ prisoner.dept_id }}"
        })

        $('#code').change(function () {
            if (hasEncodeChars($('#code').val())) {
                $('#code-alert').text('编号只能由字母和数字组成')
                code_legal = false
            } else {
                if (this.value == '') {
                    $('#code-alert').text('编号不能为空')
                    code_legal = false
                } else {
                    $('#code-alert').text('')
                    code_legal = true
                }
            }
        })
        $('#name').change(function () {
            var reg = /^([\u4E00-\u9FA5])*$/;
            if ($('#name').val().match(reg)) {
                if ($('#name').val().length < 2) {
                    $('#name-alert').text('姓名长度必须大于等于两个字')
                    name_legal = false
                } else {
                    $('#name-alert').text('')
                    name_legal = true
                }
            } else {
                $('#name-alert').text('姓名只能由中文组成')
            }
        })
        $('#id_number').change(function () {
            if (this.value == '') {
                $('#id-alert').text('')
                id_legal = true
                $('#birthday').prop('disabled', false)
                $('#gender').prop('disabled', false)
            } else {
                if (isIdcard($('#id_number').val())) {
                    $('#id-alert').text('')
                    id_legal = true
                    var birthday = getBirthdayByIdNO($('#id_number').val())
                    $('#birthday').val(birthday)
                    $('#birthday').prop('disabled', true)
                    var gender = getSexByIdNO($('#id_number').val())
                    $('#gender').val(gender)
                    $('#gender').prop('disabled', true)
                } else {
                    $('#id_number').prop('failure', true)
                    $('#id-alert').text('身份证号不合法')
                    id_legal = false
                    $('#birthday').prop('disabled', false)
                    $('#gender').prop('disabled', false)
                }
            }
            form.render('select')
        })

        form.on('submit(user-update)', function (data) {
            let roleIds = ''
            $('input[type=checkbox]:checked').each(function () {
                roleIds += $(this).val() + ','
            })
            if ($('#code').val() == '') {
                layer.msg('编号不能为空', {icon: 2, time: 1000})
                return false
            }
            if (!code_legal) {
                layer.msg('编号不合法', {icon: 2, time: 1000})
                return false
            }
            if ($('#name').val() == '') {
                layer.msg('姓名不能为空', {icon: 2, time: 1000})
                return false
            }
            if (!name_legal) {
                layer.msg('姓名不合法', {icon: 2, time: 1000})
                return false
            }
            if ($('#gender').val() == '') {
                layer.msg('请选择性别', {icon: 2, time: 1000})
                return false
            }
            if (data.field.deptId == '') {
                layer.msg('请选择所属部门', {icon: 2, time: 1000})
                return false
            }
            data.field.id = {{ prisoner.id }}
                roleIds = roleIds.substr(0, roleIds.length - 1)
            data.field.roleIds = roleIds
            if (native_province == '') {
                data.field.native_place = "";
            } else {
                data.field.native_place = native_province + "-" + native_city + "-" + native_county;
            }
            if (address_province == '') {
                data.field.address = "";
            } else {
                data.field.address = address_province + "-" + address_city + "-" + address_county + "-" + $('#address').val();
            }
            data.field.birthday = $('#birthday').val()
            data.field.sex = $('#gender').val()
            $.ajax({
                url: '/admin/prisoners/update',
                data: JSON.stringify(data.field),
                dataType: 'json',
                contentType: 'application/json',
                type: 'put',
                success: function (result) {
                    if (result.success) {
                        layer.msg(result.msg, {icon: 1, time: 1000}, function () {
                            parent.layer.close(parent.layer.getFrameIndex(window.name))//关闭当前页
                            parent.layui.table.reload('prisoners-table')
                        })
                    } else {
                        layer.msg(result.msg, {icon: 2, time: 1000})
                    }
                }
            })
            return false
        })

        // 给定一个code，判断其是否合法
        function hasEncodeChars(str) {
            return typeof str == "string" && encodeURI(str) !== str
        }

        // 给定一个身份证号，判断其是否合法
        function isIdcard(value) {
            var sId = value;
            if (sId.length == 15) {
                if (!/^\d{14}(\d|x)$/i.test(sId)) {
                    this.message = "你输入的身份证长度或格式错误";
                    return false;
                } else {
                    sId = sId.substr(0, 6) + '19' + sId.substr(6, 9);
                    sId += getVCode(sId);
                }
            }

            function getVCode(CardNo17) {
                var Wi = new Array(7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2, 1);
                var Ai = new Array('1', '0', 'X', '9', '8', '7', '6', '5', '4', '3', '2');
                var cardNoSum = 0;
                for (var i = 0; i < CardNo17.length; i++) cardNoSum += CardNo17.charAt(i) * Wi[i];
                var seq = cardNoSum % 11;
                return Ai[seq];
            }

            var aCity = {
                11: "北京",
                12: "天津",
                13: "河北",
                14: "山西",
                15: "内蒙古",
                21: "辽宁",
                22: "吉林",
                23: "黑龙江",
                31: "上海",
                32: "江苏",
                33: "浙江",
                34: "安徽",
                35: "福建",
                36: "江西",
                37: "山东",
                41: "河南",
                42: "湖北",
                43: "湖南",
                44: "广东",
                45: "广西",
                46: "海南",
                50: "重庆",
                51: "四川",
                52: "贵州",
                53: "云南",
                54: "西藏",
                61: "陕西",
                62: "甘肃",
                63: "青海",
                64: "宁夏",
                65: "新疆",
                71: "台湾",
                81: "香港",
                82: "澳门",
                91: "国外"
            };

            var iSum = 0;
            var info = "";
            if (!/^\d{17}(\d|x)$/i.test(sId)) {
                this.message = "你输入的身份证长度或格式错误";
                return false;
            }
            sId = sId.replace(/x$/i, "a");
            if (aCity[parseInt(sId.substr(0, 2))] == null) {
                this.message = "你的身份证地区非法";
                return false;
            }
            var sBirthday = sId.substr(6, 4) + "-" + Number(sId.substr(10, 2)) + "-" + Number(sId.substr(12, 2));
            var d = new Date(sBirthday.replace(/-/g, "/"));
            if (sBirthday != (d.getFullYear() + "-" + (d.getMonth() + 1) + "-" + d.getDate())) {
                this.message = "身份证上的出生日期非法";
                return false;
            }
            for (var i = 17; i >= 0; i--) iSum += (Math.pow(2, i) % 11) * parseInt(sId.charAt(17 - i), 11);
            if (iSum % 11 != 1) {
                this.message = "你输入的身份证号非法";
                return false;
            }
            return true;
        }

        // 从合法的身份证号中获取生日
        function getBirthdayByIdNO(IdNO) {
            let birthday = "";
            if (IdNO.length == 18) {
                birthday = IdNO.substr(6, 8);
                return birthday.replace(/(.{4})(.{2})/, "$1-$2-");
            } else if (IdNO.length == 15) {
                birthday = "19" + IdNO.substr(6, 6);
                return birthday.replace(/(.{4})(.{2})/, "$1-$2-");
            } else {
                return "";
            }
        }

        // 从合法的身份证号中获取性别
        function getSexByIdNO(IdNO) {
            if (IdNO.length == 18) {
                return parseInt(IdNO.charAt(16)) % 2 == 0 ? "1" : "0";
            } else if (number.length == 15) {
                return parseInt(IdNO.charAt(14)) % 2 == 0 ? "1" : "0";
            } else {
                return "";
            }
        }
    })
</script>
</body>
</html>